<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">   
    <meta name="viewport"        
        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>我的余额</title>
    <!-- <link rel="stylesheet" href="../public/css/1.css"> -->
    <link rel="stylesheet" href="../public/css/1.css">
    <link rel="stylesheet" href="../public/css/reset.css" />
    <link rel="stylesheet" href="../public/css/all_use.css" />
    <link rel="stylesheet" href="../public/css/footer.css">
    <script src="../public/js/utils/utils.js"></script>
    <!-- <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> -->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css" />
    <script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    <script src="https://cdn.bootcss.com/qs/6.7.0/qs.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js"></script>
</head>
<style>
</style>

<body>
    <div id="app">
        <div  style="display: flex;flex-direction: column;align-items: center;width: 100%;padding: 10px;">
          <div style="padding: 20px;display: flex;"><div style="color:red;font-size: 20px;font-weight: bolder">{{money}}</div>元</div>
            <div @click="tixian()" style="display: flex;justify-content: center;background-color: red;width: 50%;padding: 10px;" >立即提现</div>
        </div>
        <div style="padding: 10px;">总共{{dataList.length}}条记录</div>
        <div v-for="(item,i) in dataList" v-if="dataList.length>0">
            <div class="c">
                <div class="nc" style="display: flex;justify-content: space-around;width: 100%;padding: 10px;border-bottom: 1px solid gray;">
                        <div>
                            {{item.remark}}
                        </div>
                    <div style="color: red;font-weight: bolder;">
                        {{item.money}}元
                    </div>
                    <div>
                        {{item.createTime}}
                    </div>
                </div>
            </div>
        </div>
        <div v-if="dataList.length==0">
            <div style="display: flex;justify-content: center;">暂无输入记录</div>
        </div>
        <van-dialog v-model="show" title="发起提现" show-cancel-button="true" confirm-button-text="确定"
                    confirm-button-color="#11BD10" @confirm="close">
            <div style="padding: 10px 20px;">输入提现金额</div>
            <div style="text-align: center;margin-top: 4px;">
                <input placeholder="请输入提现金额" type="number" v-model="tmoney"/>
            </div>
            <div style="padding: 10px 20px;">提现银行卡</div>
            <div style="text-align: center; margin-top: 4px;">
                <input placeholder="请输入姓名" type="text" v-model="name"/>
            </div>
            <div style="text-align: center;margin-top: 4px;">
                <input placeholder="请输入提现银行卡号" type="text" v-model="bankNo"/>
            </div>
            <div style="text-align: center;margin-top: 4px;">
                <input placeholder="请输入所属银行支行" type="text" v-model="bank"/>
            </div>
            <div style="text-align: center;margin-top: 4px;">
                <input placeholder="请输入联系电话" type="number" maxlength="11" v-model="tel"/>
            </div>
        </van-dialog>
    </div>

</body>
<script type="module">
    import ajax from "../public/js/api/api.js";
    var app = new Vue({
        el: '#app',
        data: {
            money:0,
            tmoney:0,
            name:'',
            bank:'',
            bankNo:'',
            tel:'',
            show:false,
            message: [],
            inde: 0,
            text: '',
            choose: 0,
            flag: '',
            dataList: [],
            label: '',
            details: '',
            payMoney: '',
            account: {},
            typelist: [],
            id: "",//商品id
        },

        created() {
            this.money = this.GetRequest().money;
            console.log('money',this.money)
            this.findLog();
        },
        methods: {
            tixian(){
                //获取提现银行卡信息 有则自动填充 无则添加
                ajax
                    .findAccount2({
                    })
                    .then((res) => {
                        if (res.data.code == 0) {
                            let account = res.data.data
                            if(account.status==0){
                                alert("账号已被禁用无法提现")
                            }else{
                                ajax
                                    .getCard({})
                                    .then((res) => {
                                        console.log(res.data.data,"-----888---");
                                        let result=res.data.data;
                                        if(result!=null){
                                            this.name=result.name;
                                            this.tel=result.tel
                                            this.bank=result.bank;
                                            this.bankNo=result.bankNo
                                        }
                                        this.show=true;
                                    })
                            }
                        }
                    })
            },
            close(){
                //发起提现
                console.log(this.tmoney);
                if(this.tmoney>this.money || this.tmoney<=0){
                    alert("提现金额有误")
                    return;
                }else if(this.tel.trim().length==0 ||this.bank.trim().length==0 || this.bankNo.trim().length==0|| this.name.trim().length==0){
                    alert("提现银行卡信息不全")
                }else{
                    ajax
                        .withdraw({
                            money: this.tmoney,
                            name:this.name,
                            tel:this.tel,
                            bank:this.bank,
                            bankNo: this.bankNo
                        })
                        .then((res) => {
                            console.log(res.data.data,"-----888---");
                            if (res.data.code == 0) {
                                alert("提现成功")
                            }
                        })
                    this.show=false;
                }

            },
            findLog(){
                ajax
                    .findLog({
                        choice: 0,
                    })
                    .then((res) => {
                        console.log(res.data.data,"-----888---");
                        if (res.data.code == 0) {
                            this.dataList = res.data.data
                        }
                    })
            },
            GetRequest() {
                var url = location.search; //获取url中"?"符后的字串
                var theRequest = new Object();
                if (url.indexOf("?") != -1) {
                    var str = url.substr(1);
                    var strs = str.split("&");
                    for (var i = 0; i < strs.length; i++) {
                        theRequest[strs[i].split("=")[0]] = unescape(
                            strs[i].split("=")[1]
                        );
                    }
                }
                return theRequest;
            },
        }
    })
</script>

</html>